<template>
	<view class="wrapper">
		<head-title titleText="送TA礼物" showLeftButton="true"></head-title>
		<view class="topCont">
			<image src="../../static/image/topBg.png" mode=""></image>
		</view>
		<view class="cont flex_row">
			<view @tap="giftPay(item.id)" v-for="(item,index) in list" :key="index" class="list">
				<view class="box">
					<image :src="item.c_img" mode="aspectFill"></image>
					<view>{{item.c_name}}</view>
				</view>
				<view class="money">￥{{item.c_money}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	import headTitle from "../../components/headTitle.vue";
	import common from "../../common/network.js";
	var session = '',actid = '',userid='';
	export default {
		components:{headTitle},
		data(){
			return{
				list:[],
			}
		},
		onLoad:function(options){
			if(options.session!=undefined){
				session = options.session;
				userid = options.userid;
				this.getList();
			}
			if(options.actid!=undefined){
				actid = options.actid;
			}else{
				actid = '';
			}
		},
		methods:{
			getList:function(){
				var that = this;
				var $data = {
					'type':'zshop_index',
					'session':session,
				};
				common.network.request($data,function(res){
					console.log(res);
					that.list = res.list;
				})
			},
			giftPay:function(giftid){
				var that = this;
				var $data = {
					'type':'zpay_gift_pay',
					'session':session,
					'to_uid':userid,
					'gift_id':giftid,
					'o_id':actid,
				};
				console.log($data);
				common.network.request($data,function(res){
					uni.requestPayment({
						"timeStamp": (res.timeStamp).toString(),
						"nonceStr": res.nonceStr,
						"signType":"MD5",
						"package": res.package,
						"paySign": res.paySign,
						success:function(res){
							uni.showToast({
								icon:"success",
								title:'送礼成功',
								success:function(){
									setTimeout(function(){
										uni.navigateTo({
											url: "/pagesA/chat/chat?session="+session+"&userid="+userid
										})
									},1000)
								}
							})
						}
					})
				})
			}
		}
	}
</script>

<style scoped>
	.wrapper{
		background: #F1F5F8;
		min-height: 100vh;
	}
	.topCont image{
		width: 100%;
		height: 44px;
	}
	.cont{
		padding: 30px;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.list{
		width: 30%;
		text-align: center;
		margin-bottom: 30px;
	}
	.box{
		background: #fff;
		font-size: 28px;
		padding-top: 40px;
		border-radius: 20px;
		overflow: hidden;
		border: 1px solid rgba(121,100,255,0.6);
	}
	.box view{
		background: #6673FF;
		line-height: 54px;
		color: #fff;
		margin-top: 30px;
	}
	.list image{
		width: 100px;
		height: 100px;
	}
	.money{
		padding: 12px 0;
		font-size-adjust: 26px;
	}
</style>
